<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<!-- 导入jquery核心类库 -->
<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/jquery-1.8.3.js"></script>
<!-- 导入easyui类库 -->
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/js/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/js/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/js/easyui/ext/portal.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/css/default.css">	
<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/easyui/ext/jquery.portal.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/easyui/ext/jquery.cookie.js"></script>
<script
	src="${pageContext.request.contextPath }/js/easyui/locale/easyui-lang-zh_CN.js"
	type="text/javascript"></script>
<script type="text/javascript">
	function doAdd(){
		//alert("增加...");
		$('#addInMoneyWindow').window("open");
	}
	
	function doView(){
		alert("查看...");
	}
	
	function doDelete(){
		var rows = $('#grid').datagrid('getSelections');
		if(rows.length==0){
			
			$.messager.alert('提示信息','请选择您要删除的进账单','warning');
		}else{
			var arr = new Array();
			for (var i = 0; i < rows.length; i++) {
				arr.push(rows[i].inid)
			}
			var ids =arr.join(",");
			location.href="/deleteInMoney.action?ids="+ids;
		}
	}
	
	function doExport(){
		$('#exportInMoneyWindow').window("open");
	}
	//工具栏
	var toolbar = [ {
		id : 'button-view',	
		text : '查询',
		iconCls : 'icon-search',
		handler : doView
	}, {
		id : 'button-add',
		text : '增加',
		iconCls : 'icon-add',
		handler : doAdd
	}, {
		id : 'button-delete',
		text : '删除',
		iconCls : 'icon-cancel',
		handler : doDelete
	},{
		id : 'button-export',
		text : '导出',
		iconCls : 'icon-undo',
		handler : doExport
	}];
	// 定义列
	var columns = [ [ {
		field : 'inid',
		checkbox : true,
	},{
		field : 'inname',
		title : '收款人',
		width : 120,
		align : 'center'
	}, {
		field : 'inmoney',
		title : '收款金额',
		width : 120,
		align : 'center',
		formatter : function(data,row, index){
			if(data == null){
				return '<span style="color: red;">尚未填写金额</span>';
			}else{
				return data;
			}
		}
	}, {
		field : 'indate',
		title : '收款时间',
		width : 220,
		align : 'center',
		formatter : function(data,row, index){
			if(data == ''){
				return '<span style="color: red;">尚未填写日期</span>';
			}else{
				return data;
			}
		}
	}, {
		field : 'incomment',
		title : '备注',
		width : 300,
		align : 'center',
		formatter : function(data,row, index){
			if(data == ''){
				return '<span style="color: red;">尚未填写备注</span>';
			}else{
				return data;
			}
		}
	} ] ];
	
	$(function(){
		// 先将body隐藏，再显示，不会出现页面刷新效果
		$("body").css({visibility:"visible"});
		
		// 取派员信息表格
		$('#grid').datagrid( {
			iconCls : 'icon-forward',
			fit : true,
			border : false,
			rownumbers : true,
			striped : true,
			pageList: [30,50,100],
			pagination : true,
			toolbar : toolbar,
			url : "/InMoneyPageQuery.action",
			idField : 'inid',
			columns : columns,
			onDblClickRow : doDblClickRow
		});
		
		// 添加进账信息窗口
		$('#addInMoneyWindow').window({
	        title: '添加收款信息',
	        width: 400,
	        modal: true,
	        shadow: true,
	        closed: true,
	        height: 400,
	        resizable:false
	    });
		
		// 修改进账信息窗口
		$('#editInMoneyWindow').window({
	        title: '添加收款信息',
	        width: 400,
	        modal: true,
	        shadow: true,
	        closed: true,
	        height: 400,
	        resizable:false
	    });
		// 导出进账信息窗口
		$('#exportInMoneyWindow').window({
	        title: '添加收款信息',
	        width: 400,
	        modal: true,
	        shadow: true,
	        closed: true,
	        height: 200,
	        resizable:false
	    });
		
	});

	function doDblClickRow(rowIndex, rowData){
		$("#editInMoneyWindow").window('open');
		$("#editInMoneyForm").form('load',rowData);
	}
	
	
	//添加进账信息
	$(function() {
		$("#saveInMoney").click(function(){
			var vali = $("#addInMoneyForm").form("validate");
			if(vali){
				$("#addInMoneyForm").submit();
			}else{
				$.messager.alert('提示信息','您填写的信息不完整','warning');
			}
			
		})
	});
	
</script>	
</head>
<body class="easyui-layout" style="visibility:hidden;">
	<div region="center" border="false">
    	<table id="grid"></table>
	</div>
	<!-- 添加进账信息 -->
	<div class="easyui-window" title="添加进账信息" id="addInMoneyWindow" collapsible="false" minimizable="false" maximizable="false" style="top:20px;left:200px">
		<div region="north" style="height:31px;overflow:hidden;" split="false" border="false" >
			<div class="datagrid-toolbar">
				<a id="saveInMoney" icon="icon-save" href="#" class="easyui-linkbutton" plain="true" >保存</a>
			</div>
		</div>
		
		<div region="center" style="overflow:auto;padding:5px;" border="false">
			<form id="addInMoneyForm" action="/addInMoneyInfo.action" method="post">
				<table class="table-edit" width="80%" align="center">
					<tr class="title">
						<td colspan="2">进账统计信息</td>
					</tr>
					<tr>
						<td>收款人</td>
						<td><input type="text" name="inname" class="easyui-validatebox" required="true"/></td>
					</tr>
					<tr>
						<td>收款金额</td>
						<td><input type="text" name="inmoney" class="easyui-validatebox" required="true" validType='length[2,8]'/>
						</td>
					</tr>
					<tr>
						<td>收款日期</td>
						<td><input type="text" name="indate" class="easyui-datebox" required="true"/></td>
					</tr>
					<tr>
						<td>备注</td>
						<td>
							<textarea style="height: 90px;width: 170px" name="incomment"></textarea>
						</td>
					</tr>
				</table>
			</form>
		</div>
	</div>
	<!-- 修改进账信息 -->
	<div class="easyui-window" title="修改进账信息" id="editInMoneyWindow" collapsible="false" minimizable="false" maximizable="false" style="top:20px;left:200px">
		<div region="north" style="height:31px;overflow:hidden;" split="false" border="false" >
			<div class="datagrid-toolbar">
				<a id="editInMoney" icon="icon-save" href="#" class="easyui-linkbutton" plain="true" >保存</a>
				<script type="text/javascript">
					$(function(){
						$("#editInMoney").click(function(){
						var vali = $("#editInMoneyForm").form('validate');
							if(vali){
								$("#editInMoneyForm").submit();
								$("#editInMoneyWindow").window('close');
							}else{
								$.messager.alert('提示信息','您填写的信息不完整','warning');
							}
						});
					});
				</script>
			</div>
		</div>
		
		<div region="center" style="overflow:auto;padding:5px;" border="false">
			<form id="editInMoneyForm" action="/editInMoneyInfo.action" method="post">
				<input type="hidden" name="inid">
				<table class="table-edit" width="80%" align="center">
					<tr class="title">
						<td colspan="2">进账统计信息</td>
					</tr>
					<tr>
						<td>收款人</td>
						<td><input type="text" name="inname" class="easyui-validatebox" required="true"/></td>
					</tr>
					<tr>
						<td>收款金额</td>
						<td>
							<input type="text" name="inmoney" class="easyui-validatebox" required="true" validType='length[2,8]'/>
						</td>
					</tr>
					<tr>
						<td>收款日期</td>
						<td><input type="text" name="indate" class="easyui-datebox" required="true"/></td>
					</tr>
					<tr>
						<td>备注</td>
						<td>
							<textarea style="height: 90px;width: 170px" name="incomment"></textarea>
						</td>
					</tr>
				</table>
			</form>
		</div>
	</div>
	<!-- 导出进账信息 -->
	<div class="easyui-window" title="修改进账信息" id="exportInMoneyWindow" collapsible="false" minimizable="false" maximizable="false" style="top:20px;left:200px">
		<div region="north" style="height:31px;overflow:hidden;" split="false" border="false" >
			<div class="datagrid-toolbar">
				<a id="exportInMoney" icon="icon-undo" href="#" class="easyui-linkbutton" plain="true" >导出</a>
				<script type="text/javascript">
					$(function(){
						$("#exportInMoney").click(function(){
						var vali = $("#exportInMoneyForm").form('validate');
							if(vali){
								$("#exportInMoneyForm").submit();
								$("#exportInMoneyWindow").window('close');
								
							}else{
								$.messager.alert('提示信息','您填写的信息不完整','warning');
							}
						});
					});
				</script>
			</div>
		</div>
		
		<div region="center" style="overflow:auto;padding:5px;" border="false">
			<form id="exportInMoneyForm" action="/exportInMoneyInfo.action" method="post">
				<table class="table-edit" width="80%" align="center">
					<tr class="title">
						<td colspan="2">进账统计信息</td>
					</tr>
					<tr>
						<td>开始日期</td>
						<td><input type="text" name="beginDate" class="easyui-datebox" required="true"/></td>
					</tr>
					<tr>
						<td>结束日期</td>
						<td><input type="text" name="endDate" class="easyui-datebox" required="true"/></td>
					</tr>
				</table>
			</form>
		</div>
	</div>
</body>
</html>	